JAMstack ģķ¤ķ ģ²ģ ėķ ķ¬ź“ģ ģø ź°ģ“ė. ģ ģ ģ¬ģ“ķø ģģ±(SSG)ģ ģ“ģ , ģ¬ģ© ģ¬ė”, ģµģ ģ¹ ź°ė°ģ ģķ ģ¤ģ 구ķģ ģ¤ģ ģ ė”ėė¤.
JAMstack ģķ¤ķ ģ²: ģ ģ ģ¬ģ“ķø ģģ±(SSG) ģ¤ėŖ
ģ¹ ź°ė° ķź²½ģ ģė, 볓ģ, ķģ„ģ±ģ ėķ ģ¦ź°ķė ģźµ¬ė„¼ ķ“ź²°ķźø° ģķ“ ģė”ģ“ ģķ¤ķ ģ²ģ ė°©ė²ė” ģ“ ė±ģ„ķė©“ģ ėģģģ“ ģ§ķķź³ ģģµėė¤. ģė¹ķ 주목ģ ė°ź³ ģė ģ ź·¼ ė°©ģ ģ¤ ķėė JAMstack ģķ¤ķ ģ²ģ ėė¤. ģ“ ėøė”ź·ø ź²ģ물ģ JAMstackģ ėķ ķ¬ź“ģ ģø ź°ģ넼 ģ ź³µķė©°, ķ¹ķ ģ ģ ģ¬ģ“ķø ģģ±(SSG)ģ ģ“ģ ģ ė§ģ¶° ź·ø ģ“ģ , ģ¬ģ© ģ¬ė” ė° ģ¤ģ 구ķģ ķźµ¬ķ©ėė¤.
JAMstackģ“ė 묓ģģøź°?
JAMstackģ ķ“ė¼ģ“ģøķø ģø” JavaScript, ģ¬ģ¬ģ© ź°ė„ķ API, ģ¬ģ ė¹ėė ė§ķ¬ģ (Markup)ģ źø°ė°ģ¼ė” ķė ģµģ ģ¹ ģķ¤ķ ģ²ģ ėė¤. "JAM"ģ“ė¼ė ģ“ė¦ģ ė¤ģģ ģ½ģģ ėė¤:
- JavaScript: ėģ źø°ė„ģ ģ ģ ģ¼ė” ķ“ė¼ģ“ģøķø ģø”ģģ ģ¤ķėė JavaScriptģ ģķ“ ģ²ė¦¬ė©ėė¤.
- APIs: ģė² ģø” ė”ģ§ź³¼ ė°ģ“ķ°ė² ģ“ģ¤ ģķø ģģ©ģ HTTPS넼 ķµķ“ ģ”ģøģ¤ėė ģ¬ģ¬ģ© ź°ė„ķ APIė” ģ¶ģķė©ėė¤.
- Markup: ģ¹ģ¬ģ“ķøė ė¹ė ķė”ģøģ¤ ģ¤ģ ģ¬ģ ė¹ėė ģ ģ HTML ķģ¼ė” ģ ź³µė©ėė¤.
ėŖØė ģģ²ģ ėķ“ ģė² ģø” ė ėė§ģ“ė ėģ ģ½ķ ģø ģģ±ģ ģ씓ķė ģ ķµģ ģø ģ¹ ģķ¤ķ ģ²ģ ė¬ė¦¬, JAMstack ģ¬ģ“ķøė 미리 ė ėė§ėģ“ ģ½ķ ģø ģ ģ” ė¤ķøģķ¬(CDN)ģģ ģ§ģ ģ ź³µė©ėė¤. ģ“ė¬ķ ķė” ķøģėģ ė°±ģėģ ė¶ė¦¬ė ģė§ģ ģ“ģ ģ ģ ź³µķ©ėė¤.
ģ ģ ģ¬ģ“ķø ģģ±(SSG) ģ“ķ“ķźø°
ģ ģ ģ¬ģ“ķø ģģ±(SSG)ģ JAMstackģ ķµģ¬ źµ¬ģ± ģģģ ėė¤. ģ“ė ź° ģ¬ģ©ģ ģģ²ģ ėķ“ ėģ ģ¼ė” HTML ķģ¼ģ ģģ±ķė ėģ ė¹ė ķė”ģøģ¤ ģ¤ģ ģ ģ HTML ķģ¼ģ 구ģ¶ķė ź²ģ ķ¬ķØķ©ėė¤. ģ“ ģ ź·¼ ė°©ģģ ģė²ź° 미리 ė ėė§ė ķģ¼ė§ ģ ź³µķė©“ ėėÆė” ģ±ė„ź³¼ 볓ģģ ķ¬ź² ķ„ģģķµėė¤.
SSG ģė ė°©ģ
ģ ģ ģ¬ģ“ķø ģģ± ķė”ģøģ¤ė ģ¼ė°ģ ģ¼ė” ė¤ģ ėØź³ė„¼ ķ¬ķØķ©ėė¤:
- ģ½ķ ģø ģģ±: ģ½ķ ģø ė ė§ķ¬ė¤ģ“ ķģ¼, ķ¤ėė¦¬ģ¤ CMS ķė«ķ¼(ģ: Contentful, Netlify CMS, Strapi) ėė APIģ ź°ģ ė¤ģķ ģģ¤ģģ ź°ģ øģµėė¤.
- ė¹ė ķė”ģøģ¤: ģ ģ ģ¬ģ“ķø ģģ±źø°(SSG) ėźµ¬(ģ: Hugo, Gatsby, Next.js)ź° ģ½ķ ģø ģ ķ ķė¦æģ ź°ģ øģ ģ ģ HTML, CSS ė° JavaScript ķģ¼ģ ģģ±ķ©ėė¤.
- ė°°ķ¬: ģģ±ė ķģ¼ģ CDNģ ė°°ķ¬ėģ“ ģ ģøź³ ģ¬ģ©ģģź² ģµģķģ ģ§ģ° ģź°ģ¼ė” ģ ź³µė©ėė¤.
ģ“ ķė”ģøģ¤ė ė¹ė ģģ ė°ģķėÆė” ģ½ķ ģø ė³ź²½ģ ģ¬ģ“ķøģ ģ¬ė¹ė ė° ģ¬ė°°ķ¬ė„¼ ķøė¦¬ź±°ķ©ėė¤. ģ“ "ķ ė² ė¹ėķź³ , ģ“ėģė ė°°ķ¬ķė" ģ ź·¼ ė°©ģģ ģ¼ź“ģ±ź³¼ ģ 뢰ģ±ģ 볓ģ„ķ©ėė¤.
JAMstackź³¼ ģ ģ ģ¬ģ“ķø ģģ±ģ ģ“ģ
JAMstackź³¼ SSG넼 ģ±ķķė©“ ė¤ģź³¼ ź°ģ ģ¬ė¬ ź°ģ§ ź°ė „ķ ģ“ģ ģ ģ»ģ ģ ģģµėė¤:
- ģ±ė„ ķ„ģ: CDNģģ ģ ģ ķģ¼ģ ģ ź³µķė ź²ģ ģė²ģģ ėģ ģ¼ė” ķģ“ģ§ė„¼ ģģ±ķė ź²ė³“ė¤ ķØģ¬ ė¹ ė¦ ėė¤. ģ“ė ė ė¹ ė„ø ė”ė ģź°ź³¼ ė ėģ ģ¬ģ©ģ ź²½ķģ¼ė” ģ“ģ“ģ§ėė¤.
- ė³“ģ ź°ķ: ģ¤ķķ ģė² ģø” ģ½ėź° ģģ¼ėÆė” JAMstack ģ¬ģ“ķøė 볓ģ ģķģ ė ģ·Øģ½ķ©ėė¤.
- ķģ„ģ± ģ¦ź°: CDNģ ėģ ķøėķ½ ė¶ķ넼 ģ²ė¦¬ķėė” ģ¤ź³ėģģ¼ėÆė” JAMstack ģ¬ģ“ķøė ķģ„ģ±ģ“ ė§¤ģ° ė°ģ“ė©ėė¤.
- ė¹ģ© ģ ź°: CDNģģ ģ ģ ķģ¼ģ ģ ź³µķė ź²ģ ģ¼ė°ģ ģ¼ė” ėģ ģė² ģøķė¼ė„¼ ģ¤ķķź³ ģ ģ§ķė ź²ė³“ė¤ ģ ė “ķ©ėė¤.
- ė ėģ ź°ė°ģ ź²½ķ: JAMstackģ ź“ģ¬ģ¬ģ ėŖ ķķ ė¶ė¦¬ė„¼ ģ“ģ§ķģ¬ ģ¹ ģ ķ리ģ¼ģ“ģ ģ ė ģ½ź² ź°ė°ķź³ ģ ģ§ ź“리ķ ģ ģėė” ķ©ėė¤. ź°ė°ģė ķė” ķøģėģ ģ§ģ¤ķ ģ ģź³ , APIė ė°±ģė ė”ģ§ģ ģ²ė¦¬ķ©ėė¤.
- SEO ź°ģ : ė ė¹ ė„ø ė”ė ģź°ź³¼ ź¹ėķ HTML źµ¬ģ”°ė ź²ģ ģģ§ ģģ넼 ķ„ģģķ¬ ģ ģģµėė¤.
JAMstack ģ¬ģ© ģ¬ė”
JAMstackģ ė¤ģģ ķ¬ķØķ ė¤ģķ ģ¹ ķė”ģ ķøģ ģ ķ©ķ©ėė¤:
- ėøė”ź·ø ė° ź°ģø ģ¹ģ¬ģ“ķø: ģ ģ ģ¬ģ“ķø ģģ±źø°ė ė¹ ė„“ź³ SEO ģ¹ķģ ģø ėøė”그넼 ė§ėė ė° ģ“ģģ ģ ėė¤.
- 문ģ ģ¬ģ“ķø: JAMstackģ ė§ķ¬ė¤ģ“ģ“ė ė¤ė„ø ģ½ķ ģø ģģ¤ģģ 문ģ ģ¬ģ“ķøė„¼ ģģ±ķė ė° ģ¬ģ©ķ ģ ģģµėė¤.
- ė§ģ¼ķ ģ¹ģ¬ģ“ķø: ė¹ ė„ø ė”ė© ģź°ź³¼ ź°ķė 볓ģ ėė¶ģ JAMstackģ ė§ģ¼ķ ģ¹ģ¬ģ“ķøģ ģ¢ģ ģ ķģ ėė¤.
- ģ ģ ģź±°ė ģ¬ģ“ķø: ģ ķµģ ģ¼ė” ėģ ģ“ģ§ė§, ģ ģ ģź±°ė ģ¬ģ“ķøė ģ ķ ķģ“ģ§ ė° ģ¹“ķ ź³ 리 ėŖ©ė”ģ ģ ģ ģģ±ģ ķµķ“ ģ“ģ ģ ģ»ģ ģ ģģ¼ė©°, ėģ źø°ė„ģ JavaScript ė° APIė” ģ²ė¦¬ė©ėė¤. Snipcartģ ź°ģ ķģ¬ė JAMstack ģ¬ģ“ķøģ ģ ģ ģź±°ė źø°ė„ģ ķµķ©ķźø° ģķ ėźµ¬ė„¼ ģ ź³µķ©ėė¤.
- ėė© ķģ“ģ§: ė°ģ“ė ģ±ė„ģ¼ė” ģ ķģØģ“ ėģ ėė© ķģ“ģ§ė„¼ ė§ėėė¤.
- ėØģ¼ ķģ“ģ§ ģ ķ리ģ¼ģ“ģ (SPA): JAMstackģ SPA넼 ķøģ¤ķ ķė ė° ģ¬ģ©ķ ģ ģģ¼ė©°, ģ“źø° HTML ķģ¼ģ 미리 ė ėė§ėź³ ķģ ģķø ģģ©ģ JavaScriptģ ģķ“ ģ²ė¦¬ė©ėė¤.
- źø°ģ ģ¹ģ¬ģ“ķø: ė§ģ ėźø°ģ ė¤ģ“ ķģ„ģ±ź³¼ 볓ģ ģ“ģ ģ ķģ©ķģ¬ ģ¹ģ¬ģ“ķøģ ģ¼ė¶ ėė ģ ė¶ģ JAMstackģ ģ±ķķź³ ģģµėė¤.
ģøźø° ģė ģ ģ ģ¬ģ“ķø ģģ±źø°
ģ¬ė¬ ģ ģ ģ¬ģ“ķø ģģ±źø°ź° ģģ¼ė©°, ź°ź° ģ„ėØģ ģ“ ģģµėė¤. ź°ģ„ ģøźø° ģė ź²ė¤ģ ė¤ģź³¼ ź°ģµėė¤:
- Hugo: Goė” ģģ±ė ė¹ ė„“ź³ ģ ģ°ķ SSGģ ėė¤. ģėģ ģ¬ģ© ķøģģ±ģ¼ė” ģ ėŖ ķ©ėė¤. ģģ: ėź·ėŖØ ģ¤ķ ģģ¤ ķė”ģ ķøģ 문ģ ģ¬ģ“ķøė ģģ² ķģ“ģ§ė„¼ ģ ģķź² ģ²ė¦¬ķźø° ģķ“ Hugoė” źµ¬ģ¶ė©ėė¤.
- Gatsby: ė°ģ“ķ° ź°ģ øģ¤źø°ė„¼ ģķ“ GraphQLģ ķģ©ķė React źø°ė° SSGģ ėė¤. ģ±ė„ģ ģ¤ģ ģ ė ė³µģ”ķ ģ¹ ģ ķ리ģ¼ģ“ģ ģ źµ¬ģ¶ķė ė° ģøźø°ź° ģģµėė¤. ģģ: ģķķøģØģ“ ķģ¬ģ ė§ģ¼ķ ģ¹ģ¬ģ“ķøė ķ¤ėė¦¬ģ¤ CMSģģ ģ½ķ ģø ė„¼ ź°ģ øģ ė§¤ģ° ģ±ė„ģ“ ė°ģ“ė ģ¬ģ©ģ ź²½ķģ ė§ė¤źø° ģķ“ Gatsby넼 ģ¬ģ©ķ©ėė¤.
- Next.js: ģ ģ ģ¬ģ“ķø ģģ±ź³¼ ģė² ģø” ė ėė§ģ ėŖØė ģ§ģķė React ķė ģģķ¬ģ ėė¤. ź°ėØķź³ ė³µģ”ķ ģ¹ ģ ķ리ģ¼ģ“ģ ėŖØė넼 구ģ¶ķė ė° ė¤ģ¬ė¤ė„ķ ģ ķģ ėė¤. ģģ: ģ ģ ģź±°ė ģ¤ķ ģ“ė 주ģ ģ ķ ģ¹“ķ ź³ 리ģ SEO넼 ź°ģ ķź³ ģ“źø° ė”ė ģź°ģ ģ¤ģ“źø° ģķ“ Next.js ģ ģ ģģ±ģ ė¶ė¶ģ ģ¼ė” ķģ©ķ©ėė¤.
- Jekyll: ėØģģ±ź³¼ ģ¬ģ© ķøģģ±ģ¼ė” ģ ėŖ ķ Ruby źø°ė° SSGģ ėė¤. ģ“볓ģģź² ģ¢ģ ģ ķģ ėė¤. ģģ: ź°ģø ėøė”ź·øė Jekyllė” ģ“ģėė©° GitHub Pagesģģ ķøģ¤ķ ė©ėė¤.
- Eleventy (11ty): ģ ģ°ģ±ź³¼ ģ±ė„ģ ģ¤ģ ģ ė JavaScriptė” ģģ±ė ė ź°ėØķ ģ ģ ģ¬ģ“ķø ģģ±źø° ėģģ ėė¤. ģģ: ģź·ėŖØ źø°ģ ģ ź°ėØķģ§ė§ ė¹ ė„“ź³ SEO ģ¹ķģ ģø ģ¹ģ¬ģ“ķøė„¼ ė§ė¤źø° ģķ“ Eleventy넼 ģ¬ģ©ķ©ėė¤.
- Nuxt.js: SSG ė° SSRģ ėķ“ ėģ¼ķ ź°ė„ģ±ģ ģ ź³µķė Next.jsģ Vue.js ė²ģ ģ ėė¤.
ķ¤ėė¦¬ģ¤ CMS ķµķ©
JAMstackģ ģ¤ģķ 츔멓ģ ķ¤ėė¦¬ģ¤ CMSģģ ķµķ©ģ ėė¤. ķ¤ėė¦¬ģ¤ CMSė ģ½ķ ģø ģģ± ė° ź“리넼 ģķ ė°±ģė넼 ģ ź³µķģ§ė§ 미리 ģ ģė ķė” ķøģėź° ģė ģ½ķ ģø ź“리 ģģ¤ķ ģ ėė¤. ģ“넼 ķµķ“ ź°ė°ģė ģ ķøķė ķė” ķøģė ķė ģģķ¬ė„¼ ģ ķķź³ ė§ģ¶¤ķ ģ¬ģ©ģ ź²½ķģ źµ¬ģ¶ķ ģ ģģµėė¤.
ģøźø° ģė ķ¤ėė¦¬ģ¤ CMS ķė«ķ¼ģ ė¤ģź³¼ ź°ģµėė¤:
- Contentful: ė³µģ”ķ ģ¹ ģ ķ리ģ¼ģ“ģ ģ ģ ķ©ķ ģ ģ°ķź³ ķģ„ ź°ė„ķ ķ¤ėė¦¬ģ¤ CMSģ ėė¤.
- Netlify CMS: Netlifyģ ģ½ź² ķµķ©ķ ģ ģė ģ¤ķ ģģ¤ Git źø°ė° CMSģ ėė¤.
- Strapi: ėģ ģģ¤ģ ģ¬ģ©ģ ģ ģ넼 ģ ź³µķė ģ¤ķ ģģ¤ Node.js źø°ė° ķ¤ėė¦¬ģ¤ CMSģ ėė¤.
- Sanity: ģ½ķ ģø ė„¼ ė°ģ“ķ°ė” ģ·Øźøķė źµ¬ģ± ź°ė„ķ ģ½ķ ģø ķ“ė¼ģ°ėģ ėė¤.
- Prismic: ģ½ķ ģø ģ ģģģ ģ“ģ ģ ė§ģ¶ ė ė¤ė„ø ķ¤ėė¦¬ģ¤ CMS ģ루ģ ģ ėė¤.
ķ¤ėė¦¬ģ¤ CMS넼 ģ ģ ģ¬ģ“ķø ģģ±źø°ģ ķµķ©ķė©“ ģ½ķ ģø ģ ģģź° ģ½ė넼 걓ėė¦¬ģ§ ģź³ ė ģ¹ģ¬ģ“ķø ģ½ķ ģø ė„¼ ģ½ź² ź“리ķ ģ ģģµėė¤. ģ½ķ ģø ė³ź²½ģ ģ¬ģ“ķøģ ģ¬ė¹ė ė° ģ¬ė°°ķ¬ė„¼ ķøė¦¬ź±°ķģ¬ ķģ ģµģ ģ½ķ ģø ė„¼ ģ¬ģ©ķ ģ ģėė” ė³“ģ„ķ©ėė¤.
ģė²ė¦¬ģ¤ ķØģ
JAMstackģ ģ£¼ė” ģ ģ ķģ¼ģ ģ씓ķģ§ė§, ģė²ė¦¬ģ¤ ķØģ넼 ģ¬ģ©ķģ¬ ģ¹ģ¬ģ“ķøģ ėģ źø°ė„ģ ģ¶ź°ķ ģ ģģµėė¤. ģė²ė¦¬ģ¤ ķØģė ģė² ģøķė¼ė„¼ ź“리ķ ķģ ģģ“ ģ£¼ė¬øķģ¼ė” ģ¤ķėė ģź³ ė 립ģ ģø ģ½ė ģ”°ź°ģ ėė¤. ė¤ģź³¼ ź°ģ ģģ ģ ģ주 ģ¬ģ©ė©ėė¤:
- ģģ ģ ģ¶: ģģ ģ ģ¶ ģ²ė¦¬ ė° ģ“ė©ģ¼ ģ ģ”.
- ģøģ¦: ģ¬ģ©ģ ģøģ¦ ė° ź¶ķ ė¶ģ¬ 구ķ.
- API ģķø ģģ©: ė°ģ“ķ°ė„¼ ź²ģķź±°ė ģ ė°ģ“ķøķźø° ģķ“ ķģ¬ API ķøģ¶.
- ėģ ģ½ķ ģø : ź°ģøķė ģ½ķ ģø ėė ėģ ė°ģ“ķ° ģ ė°ģ“ķø ģ ź³µ.
ģøźø° ģė ģė²ė¦¬ģ¤ ķė«ķ¼ģ ė¤ģź³¼ ź°ģµėė¤:
- AWS Lambda: Amazonģ ģė²ė¦¬ģ¤ 컓ķØķ ģė¹ģ¤.
- Netlify Functions: Netlifyģ ė“ģ„ ģė²ė¦¬ģ¤ ķØģ ķė«ķ¼.
- Google Cloud Functions: Googleģ ģė²ė¦¬ģ¤ 컓ķØķ ģė¹ģ¤.
- Azure Functions: Microsoftģ ģė²ė¦¬ģ¤ 컓ķØķ ģė¹ģ¤.
ģė²ė¦¬ģ¤ ķØģė JavaScript, Python, Goģ ź°ģ ė¤ģķ ģøģ“ė” ģģ±ķ ģ ģģµėė¤. ģ¼ė°ģ ģ¼ė” HTTP ģģ²ģ“ė ė¤ė„ø ģ“벤ķøģ ģķ“ ķøė¦¬ź±°ėėÆė” JAMstack ģ¬ģ“ķøģ ėģ źø°ė„ģ ģ¶ź°ķźø° ģķ ė¤ģ¬ė¤ė„ķ ėźµ¬ģ ėė¤.
구ķ ģģ
JAMstack ģķ¤ķ ģ²ģ ėŖ ź°ģ§ 구ķ ģģ넼 ģ“ķ“ė³“ź² ģµėė¤:
Gatsbyģ Contentfulė” ėøė”ź·ø 구ģ¶ķźø°
ģ“ ģģė Gatsby넼 ģ ģ ģ¬ģ“ķø ģģ±źø°ė”, Contentfulģ ķ¤ėė¦¬ģ¤ CMSė” ģ¬ģ©ķģ¬ ėøė”그넼 구ģ¶ķė ė°©ė²ģ 볓ģ¬ģ¤ėė¤.
- Contentful ģ¤ģ : Contentful ź³ģ ģ ė§ė¤ź³ ėøė”ź·ø ź²ģ물ģ ėķ ģ½ķ ģø ėŖØėø(ģ: ģ ėŖ©, 본문, ģģ±ģ, ė ģ§)ģ ģ ģķ©ėė¤.
- Gatsby ķė”ģ ķø ģģ±: Gatsby CLI넼 ģ¬ģ©ķģ¬ ģ ķė”ģ ķøė„¼ ė§ėėė¤:
gatsby new my-blog - Gatsby ķė¬ź·øģø ģ¤ģ¹: Contentfulģģ ė°ģ“ķ°ė„¼ ź°ģ øģ¤źø° ģķ“ ķģķ Gatsby ķė¬ź·øģøģ ģ¤ģ¹ķ©ėė¤:
npm install gatsby-source-contentful - Gatsby 구ģ±:
gatsby-config.jsķģ¼ģ 구ģ±ķģ¬ Contentful ź³µź° ė° ģ½ķ ģø ėŖØėøģ ģ°ź²°ķ©ėė¤. - ķ ķ릿 ģģ±: ėøė”ź·ø ź²ģ물ģ ė ėė§ķźø° ģķ React ķ ķ릿ģ ė§ėėė¤.
- Contentful ė°ģ“ķ° ģæ¼ė¦¬: GraphQL 쿼리넼 ģ¬ģ©ķģ¬ Contentfulģģ ėøė”ź·ø ź²ģ물 ė°ģ“ķ°ė„¼ ź°ģ øģµėė¤.
- Netlifyģ ė°°ķ¬: ģ§ģģ ģø ė°°ķ¬ė„¼ ģķ“ Gatsby ķė”ģ ķøė„¼ Netlifyģ ė°°ķ¬ķ©ėė¤.
Contentfulģģ ģ½ķ ģø ź° ģ ė°ģ“ķøė ėė§ė¤ Netlifyė ģėģ¼ė” ģ¬ģ“ķøė„¼ ģ¬ė¹ėķź³ ģ¬ė°°ķ¬ķ©ėė¤.
Hugoė” ė¬øģ ģ¬ģ“ķø źµ¬ģ¶ķźø°
Hugoė ė§ķ¬ė¤ģ“ ķģ¼ė” 문ģ ģ¬ģ“ķøė„¼ ė§ėė ė° ķģķ©ėė¤.
- Hugo ģ¤ģ¹: ģģ¤ķ ģ Hugo CLI넼 ģ¤ģ¹ķ©ėė¤.
- Hugo ķė”ģ ķø ģģ±: Hugo CLI넼 ģ¬ģ©ķģ¬ ģ ķė”ģ ķøė„¼ ė§ėėė¤:
hugo new site my-docs - ģ½ķ
ģø ķģ¼ ģģ±:
contentėė ķ 리ģ 문ģ ģ½ķ ģø ģ ėķ ė§ķ¬ė¤ģ“ ķģ¼ģ ė§ėėė¤. - Hugo 구ģ±: ģ¬ģ“ķøģ ėŖØģź³¼ ėģģ ģ¬ģ©ģ ģ ģķźø° ģķ“
config.tomlķģ¼ģ 구ģ±ķ©ėė¤. - ķ ė§ ģ ķ: 문ģ ģźµ¬ ģ¬ķģ ė§ė Hugo ķ ė§ė„¼ ģ ķķ©ėė¤.
- Netlify ėė GitHub Pagesģ ė°°ķ¬: ķøģ¤ķ ģ ģķ“ Hugo ķė”ģ ķøė„¼ Netlify ėė GitHub Pagesģ ė°°ķ¬ķ©ėė¤.
Hugoė ė¹ė ķė”ģøģ¤ ģ¤ģ ė§ķ¬ė¤ģ“ ģ½ķ ģø ģģ ģ ģ HTML ķģ¼ģ ģėģ¼ė” ģģ±ķ©ėė¤.
ź³ ė ¤ ģ¬ķ ė° ź³¼ģ
JAMstackģ ģė§ģ ģ“ģ ģ ģ ź³µķģ§ė§, ė¤ģź³¼ ź°ģ ź³¼ģ 넼 ź³ ė ¤ķė ź²ģ“ ģ¤ģķ©ėė¤:
- ė¹ė ģź°: ģ½ķ ģø ź° ė§ģ ėź·ėŖØ ģ¬ģ“ķøė ė¹ė ģź°ģ“ źøøģ“ģ§ ģ ģģµėė¤. ė¹ė ķė”ģøģ¤ė„¼ ģµģ ķķź³ ģ¦ė¶ ė¹ė넼 ģ¬ģ©ķė©“ ģ“ ė¬øģ 넼 ģķķė ė° ėģģ“ ė ģ ģģµėė¤.
- ėģ źø°ė„: ė³µģ”ķ ėģ źø°ė„ģ źµ¬ķķė ¤ė©“ ģė²ė¦¬ģ¤ ķØģė ė¤ė„ø API넼 ģ¬ģ©ķ“ģ¼ ķ ģ ģģµėė¤.
- ģ½ķ ģø ģ ė°ģ“ķø: ģ½ķ ģø ģ ė°ģ“ķøė ģ¬ģ“ķøģ ģ¬ė¹ė ė° ģ¬ė°°ķ¬ź° ķģķė©°, ģź°ģ“ ź±øė¦“ ģ ģģµėė¤.
- ėģ ģ½ķ ģø ģ SEO: ģ½ķ ģø ģ ģė¹ ė¶ė¶ģ ėģ ģ¼ė” ģģ±ķ“ģ¼ ķė ź²½ģ°, JAMstackź³¼ ģ ģ ģ¬ģ“ķø ģģ±ģ“ ģµģ ģ ģ ķģ“ ģė ģ ģź±°ė JavaScript넼 ķģ±ķķ ģ¬ģ ė ėė§ ė° CDN ģ ź³µź³¼ ź°ģ ź³ źø ģ ėµģ“ ķģķ ģ ģģµėė¤.
- ķģµ ź³”ģ : ź°ė°ģė ģ ģ ģ¬ģ“ķø ģģ±źø°, ķ¤ėė¦¬ģ¤ CMS ķė«ķ¼, ģė²ė¦¬ģ¤ ķØģģ ź°ģ ģė”ģ“ ėźµ¬ģ źø°ģ ģ ė°°ģģ¼ ķ©ėė¤.
JAMstack ź°ė°ģ ģķ ėŖØė² ģ¬ė”
JAMstackģ ģ“ģ ģ ź·¹ėķķė ¤ė©“ ė¤ģ ėŖØė² ģ¬ė”넼 ė°ė„“ģģģ¤:
- ģ“ėÆøģ§ ģµģ ķ: ķģ¼ ķ¬źø°ė„¼ ģ¤ģ“ź³ ė”ė© ģź°ģ ź°ģ ķźø° ģķ“ ģ“미ģ§ė„¼ ģµģ ķķ©ėė¤.
- CSS ė° JavaScript ģ¶ģ: ķģ¼ ķ¬źø°ė„¼ ģ¤ģ“źø° ģķ“ CSS ė° JavaScript ķģ¼ģ ģ¶ģķ©ėė¤.
- CDN ģ¬ģ©: ģ¬ģ©ģģ ė ź°ź¹ģ“ ģģ¹ģģ ģ ģ ķģ¼ģ ģ ź³µķźø° ģķ“ CDNģ ģ¬ģ©ķ©ėė¤.
- ģŗģ± 구ķ: ģė² ė¶ķ넼 ģ¤ģ“ź³ ģ±ė„ģ ķ„ģģķ¤źø° ģķ“ ģŗģ± ģ ėµģ 구ķķ©ėė¤.
- ģ±ė„ ėŖØėķ°ė§: ģ¹ģ¬ģ“ķø ģ±ė„ģ ėŖØėķ°ė§ķģ¬ ė³ėŖ© ķģģ ģė³ķź³ ķ“ź²°ķ©ėė¤.
- ė°°ķ¬ ģėķ: Netlifyė GitHub Actionsģ ź°ģ ėźµ¬ė„¼ ģ¬ģ©ķģ¬ ė¹ė ė° ė°°ķ¬ ķė”ģøģ¤ė„¼ ģėķķ©ėė¤.
- ģ¬ė°ė„ø ėźµ¬ ģ ķ: ķė”ģ ķøģ ģźµ¬ ģ¬ķģ ź°ģ„ ģ ķ©ķ ģ ģ ģ¬ģ“ķø ģģ±źø°, ķ¤ėė¦¬ģ¤ CMS ė° ģė²ė¦¬ģ¤ ķė«ķ¼ģ ģ ķķ©ėė¤.
JAMstackģ 미ė
JAMstackģ ė°ģ 미ė넼 ź°ģ§ ė¹ ė„“ź² ģ§ķķė ģķ¤ķ ģ²ģ ėė¤. ģ¹ ź°ė°ģ“ ėģ± ėŖØėķėź³ ė¶ė¦¬ė ģ ź·¼ ė°©ģģ¼ė” ź³ģ ģ“ėķØģ ė°ė¼ JAMstackģ ėģ± ģøźø°ė„¼ ģ»ģ ź°ė„ģ±ģ“ ėģµėė¤. JAMstack ź°ė°ģ ź³¼ģ 넼 ķ“ź²°ķź³ ź³ ģ±ė„, 볓ģ ė° ķģ„ ź°ė„ķ ģ¹ ģ ķ리ģ¼ģ“ģ ģ ė ģ½ź² 구ģ¶ķź³ ģ ģ§ ź“리ķ ģ ģėė” ģė”ģ“ ėźµ¬ģ źø°ģ ģ“ ģ§ģģ ģ¼ė” ė±ģ„ķź³ ģģµėė¤. ģ£ģ§ 컓ķØķ ģ ė¶ģ ėķ ģķ ģ ķ ź²ģ“ė©°, ė ė§ģ ėģ źø°ė„ģ“ ģ¬ģ©ģģ ė ź°ź¹ģ“ ź³³ģģ ģ¤ķė ģ ģź² ķģ¬ JAMstack ģ¬ģ“ķøģ źø°ė„ģ ėģ± ķ„ģģķ¬ ź²ģ ėė¤.
ź²°ė”
ģ ģ ģ¬ģ“ķø ģģ±ģ ķµģ¬ģ¼ė” ķė JAMstack ģķ¤ķ ģ²ė ķėģ ģø ģ¹ ģ ķ리ģ¼ģ“ģ ģ źµ¬ģ¶ķė ź°ė „ķź³ ķØģØģ ģø ė°©ė²ģ ģ ź³µķ©ėė¤. ķė” ķøģė넼 ė°±ģėģģ ė¶ė¦¬ķź³ CDNģ ķģ ķģ©ķØģ¼ė”ģØ JAMstack ģ¬ģ“ķøė ė°ģ“ė ģ±ė„, 볓ģ ė° ķģ„ģ±ģ ė¬ģ±ķ ģ ģģµėė¤. ź³ ė ¤ķ“ģ¼ ķ ź³¼ģ ź° ģģ§ė§, JAMstackģ ģ“ģ ģ ź“ė²ģķ ģ¹ ķė”ģ ķøģ ė§¤ė „ģ ģø ģ ķģ“ ė©ėė¤. ģ¹ģ“ ź³ģ ģ§ķķØģ ė°ė¼ JAMstackģ ģ¹ ź°ė°ģ 미ė넼 ķģ±ķė ė° ģ ģ ė ģ¤ģķ ģķ ģ ķ ź²ģ ėė¤. JAMstackģ ģ±ķķė©“ ź°ė°ģź° ģ ģøź³ ģ¬ģ©ģ넼 ģķ“ ė ė¹ ė„“ź³ , ė ģģ ķė©°, ė ģ ģ§ ź“ė¦¬ķźø° ģ¬ģ“ ģ¹ ź²½ķģ ė§ė¤ ģ ģģµėė¤.
ģ¬ė°ė„ø ėźµ¬ė„¼ ģ ģ¤ķź² ģ ķķź³ ėŖØė² ģ¬ė”넼 ė°ė„“ė©“ ź°ė°ģė JAMstackģ ķģ ķģ©ķģ¬ ė°ģ“ė ģ¹ ź²½ķģ źµ¬ģ¶ķ ģ ģģµėė¤. ėøė”ź·ø, 문ģ ģ¬ģ“ķø, ė§ģ¼ķ ģ¹ģ¬ģ“ķø ėė ė³µģ”ķ ģ¹ ģ ķ리ģ¼ģ“ģ ģ źµ¬ģ¶ķė JAMstackģ źø°ģ”“ ģ¹ ģķ¤ķ ģ²ģ ėķ ź°ė „ķ ėģģ ģ ź³µķ©ėė¤.
ģ“ ź²ģ물ģ ģ¼ė°ģ ģø ģź° ģķ ģ ķ©ėė¤. ķ¹ģ ģ ģ ģ¬ģ“ķø ģģ±źø°, ķ¤ėė¦¬ģ¤ CMS ģµģ ė° ģė²ė¦¬ģ¤ ķØģ 구ķģ ėķ ģ¶ź° ģ°źµ¬ė„¼ ģ ź·¹ ź¶ģ„ķ©ėė¤.